<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>Document</title>
</head>

<body>

</body>
<script>
    

    // 查找节点方法
    // 元素.parentNode 获取父元素  ****
    // console.log(li.parentNode.parentNode.parentNode.parentNode.parentNode)
    // 元素.firstChild  // 获取第一个节点
    // console.log(li.firstChild)
    // 元素.firstElementChild  //获取第一个元素节点
    // console.log(li.firstElementChild)  ******

    // 元素.lastElementChild  //获取最后子元素节点
    // console.log(li.lastElementChild)  *******
    // 元素.lastChild //获取最后一个子节点
    // console.log(li.lastChild)
    // 元素.previousElementSibling 上一个兄弟元素节点   ******
    // console.log(li.previousElementSibling)
    // 元素.nextElementSibling 下一个兄弟元素节点   *****
    // console.log(li.nextElementSibling)


    // 元素.childNodes   //获取所有子节点
    // console.log(li.childNodes)
    // 元素.children   //所有子元素节点  *********
    // console.log(li.children)

    
</script>

</html>